<template>
  <h1>El组件-日期时间选择器</h1>
  <el-date-picker
    v-model="rq"
    type="date"
    @change="console.log(rq)"
    format="YYYY/MM/DD"
    value-format="YYYY-MM-DD"
    placeholder="选择日期">
  </el-date-picker>
  <br>
  <el-date-picker
    v-model="sj"
    type="datetime"
    @change="console.log(sj)"
    format="YYYY/MM/DD HH:mm:ss"
    value-format="YYYY-MM-DD HH:mm:ss"
    placeholder="选择日期时间">
  </el-date-picker>
  <br>
  <el-date-picker
    v-model="times"
    type="datetimerange"
    @change="f"
    format="YYYY/MM/DD HH:mm:ss"
    value-format="YYYY-MM-DD HH:mm:ss"
    start-placeholder="开始时间"
    end-placeholder="结束时间"
    range-separator="至"
  ></el-date-picker>




</template>
<script setup>
import {ref} from "vue";
const rq = ref('')
const sj = ref('')

const times = ref([])

const f = ()=>{
  console.log(times.value)
  console.log(times.value[0])
  console.log(times.value[1])
}





</script>
<style scoped>
</style>